<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
		*{
			padding: 0;
			margin: 0;
		}
			.meituan{
				width: 293px;
				height: 315px;
				/*border: 1px solid blue;*/
				margin:0 auto;
			    position: relative;
			}
			.meituan:hover{
				border: 1px solid blue;
			}
			.meituan img{
				width: 260px;
				height: 154px;
				left: 16px;
				top: 11px;
				position: absolute;
			}
			.meituan .huoguo{
				font-size: 14px;
				font-family:"Hiragino Sans GB"," Microsoft YaHei","WenQuanYi Micro Hei",arial,sans-serif;
			    height: 24px;
			    line-height: 24px;
			    display: block;
			    color: #333;
			    text-decoration: none;
			    left: 11px;
			    bottom: 116px;
			    position: absolute;
			 }
			 .meituan .daijinquan{
			 	display: block;
			 	font-size:14px ;
			 	font-family:"Hiragino Sans GB"," Microsoft YaHei","WenQuanYi Micro Hei",arial,sans-serif; ;
			    height: 24px;
			    line-height: 24px;
			    color: #666;
			    text-decoration: none;
			    left: 18px;
			    bottom: 91px;
			    position: absolute;
			 }
			 .meituan .daijinquan:hover{
			 	color:#333 ;
			 }
			 .meituan .price{
			 	font-size:20px;
			 	font-family: arial,sans-serif;
			 	color: #f76120;
			 	left: 19px;
			 	bottom: 58px;
			 	position: absolute;
			 }
			 .meituan .old_price{
			 	font-size: 12px;
			 	font-family:"Hiragino Sans GB","WenQuanYi Micro Hei",tahoma,sans-serif; 
			    height: 20px;
			    line-height: 20px;
			    color: #999;
			    left: 56px;
			    bottom: 58px;
			    position: absolute;
			 }
			 .meituan .money{
			 	text-decoration: line-through;
			 }
			 .meituan .sold_out{
			 	font-size:12px;
			 	font-family: arial,sans-serif;
			 	color: #999;
			 	font-weight: 400;
			 	right: 16px;
			 	bottom: 59px;
			 	position: absolute;
			 }
			 .meituan .new_user{
			 	width: 94px;
			 	font-size:12px;
			 	font-family:"Hiragino Sans GB","WenQuanYi Micro Hei",tahoma,sans-serif;
			 	height: 16px;
			 	line-height: 16px;
			 	text-align: center;
			 	color: #fff;
			 	background: #ff8e3f;
			 	left: 19px;
			 	bottom: 20px;
			 	position: absolute;
			 }
			 .meituan .star{
			 	font-size: 16px;
			 	height: 16px;
			 	line-height: 16px;
			 	left: 145px;
			 	bottom: 20px;
			 	position: absolute;
			 	color: #ff8e3f;
			 }
			 .meituan .star1{
			    font-size: 16px;
			 	height: 16px;
			 	line-height: 16px;
			 	left: 198px;
			 	bottom: 20px;
			 	position: absolute;
			 	color: #D1D1D1;	
			 }
			 .meituan .evaluate{
			 	font-size:12px;
			 	font-family:arial,sans-serif;
			 	text-decoration: none; 
			 	color: #999;
			 	right: 16px;
			 	bottom: 20px;
			 	position: absolute;
			 }
			 .meituan .evaluate:hover{
			 	color:#2bb8aa ;
			 }
			 .meituan .tupian{
			 	width: 41px;
			 	height: 42px;
			 	background: url(datu.png) 0px -451px;
			 	left: 16px;
			 	top: 11px;
			 	position: absolute;
			 	z-index: 1;
			 }
			 .meituan .tupian2{
			 	width: 41px;
			 	height: 42px;
			 	background: url(datu.png) 0px -493px;
			 	left: 56px;
			 	top: 11px;
			 	position: absolute;
			 	z-index: 1;
			 }
		</style>
	</head>
	<body>
		
		<div class="meituan">
	        <a href=""><div class="tupian"></div></a>
			<a href=""><div class="tupian2"></div></a>
			<a href=""><img src="meishi.jpg"/></a>
			<a class="huoguo" href="">【4店通用】古炉火锅-最成都</a>
			<a class="daijinquan" href="">50元代金券1张，除酒水、锅底、蘸料外</a>
		    <span class="price">¥40</span>
		    <span class="old_price">门店价 <span class="money">¥50</span></span>
		    <p class="sold_out">已售5230</p>
		    <span class="new_user">新用户立减15元</span>
		    <span class="star">★★★★</span><span class="star1">★</span>
		    <a href="" class="evaluate">202人评价</a>
		</div>
			
	</body>
</html>
